<template>
    <div class="app-container">
        <div style="text-align: center;margin-bottom: 30px">
            临时任务新增
        </div>
        <el-form :model="taskForm" ref="taskForm" :rules="taskFormRules" label-width="100px">
            <el-row :gutter="10">
                <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
                    <el-form-item label="任务名称" prop="name">
                        <el-input type="text" v-model="taskForm.name" placeholder="请输入任务名称" clearable></el-input>
                    </el-form-item>
                </el-col>
              <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
                <el-form-item label="任务类型" prop="taskType">
                  <el-select style="width: 100%" v-model="taskForm.type" placeholder="请选择任务类型">
                    <el-option v-for="(item,index) in taskTypeList" :key="index" :value="item.id"
                               :label="item.title"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
                <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
                    <el-form-item label="所属区域" prop="regionId">
                        <el-select v-model="taskForm.regionId" placeholder="请选择所属区域" style="width: 100%">
                            <el-option v-for="(item,index) in regionList" :key="index" :value="item.ucId" :label="item.name"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
                    <el-form-item label="所属主体" prop="enterpriseId" >
                        <el-select v-model="taskForm.enterpriseId" placeholder="请选择主体" style="width: 100%" @change="getInUserList">
                            <el-option v-for="(item,index) in enterpriseDominantList" :key="index" :value="item.ucId"
                                       :label="item.name"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
                    <el-form-item label="任务内容" prop="content">
                        <el-input v-model="taskForm.content" placeholder="请输入任务内容" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
                    <el-form-item label="执行人员" prop="userId">
                        <el-select v-model="taskForm.userId" placeholder="请选择执行人员" style="width: 100%">
                            <el-option v-for="(item,index) in userList" :key="index" :value="item.ucId"
                                       :label="item.disPlayName"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl=12>
                    <el-form-item label="任务开始时间" prop="startTime">
                        <el-time-picker style="width: 100%"
                                        v-model="taskForm.startTime"
                                        :picker-options="{
                                       selectableRange: '00:00:00 - 23:59:59'
                                      }"
                        >
                        </el-time-picker>
                    </el-form-item>

                </el-col>
                <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl=12>
                    <el-form-item label="任务结束时间" prop="endTime">
                        <el-time-picker style="width: 100%"
                                        v-model="taskForm.endTime"
                                        :picker-options="{
                                       selectableRange: '00:00:00 - 23:59:59',
                                       minTime:taskForm.startTime
                                }"
                        >
                        </el-time-picker>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <div slot="footer" style="text-align: center" class="dialog-footer">
            <el-button @click="cancelAction">取 消</el-button>
            <el-button  type="primary" @click="createTask">创 建</el-button>
        </div>
    </div>
</template>

<script>
import {addTemporaryTask} from "@/api/taskinfo";
import {addInDailyTasks, getTaskType} from "@/api/dailyTasks";
import {getInEnterpriseList, getInUserList} from "@/api/enterprise";
import {getInEnterpriseDominantList} from "@/api/enterpriseDominant";
import {getInRegionList} from "@/api/region";
import {getTask} from "../../../api/dailyTasks";


export default {
    name: "taskEdit",
    data() {
        return {
            taskForm: {
                status:true,
            },
            enterpriseDominantList:[],
            taskFormRules:{
                name: [{required: true, message: '任务名称不能为空', trigger: 'blur'}],
                content: [{required: true, message: '任务内容不能为空', trigger: 'blur'}],
                enterpriseId :[{required: true, message: '所属企业不能为空', trigger: 'blur'}],
                type :[{required: true, message: '任务类型不能为空', trigger: 'blur'}],
            },
            userList:[],
            regionList:[],
          taskTypeList:[]
        }
    },
    created() {
      this.getTaskType()
        this.getInEnterpriseDominantList()
        this.getInRegionList()
    },
    methods: {
        getTaskType(){
        getTaskType({name:"TaskEnum"}).then(res=>{
          this.taskTypeList=res.data
        }).catch(res=>{
          console.log("失败")
        })
      },
        cancelAction() {
            let view = {
                fullPath: this.$route.path,
                path: this.$route.path,
                name: this.$route.name,
                meta: {...this.$route.meta}
            }
            this.$store.dispatch('tagsView/delView', view).then(({visitedViews}) => {
                if (view.path == this.$route.path) {
                    const latestView = visitedViews.slice(-1)[0]
                    // console.log(latestView)
                    if (latestView) {
                        this.$router.push(latestView.fullPath)
                    } else {
                        // now the default is to redirect to the home page if there is no tags-view,
                        // you can adjust it according to your needs.
                        if (view.name === 'Dashboard') {
                            // to reload home page
                            this.$router.replace({path: '/redirect' + view.fullPath})
                        } else {
                            this.$router.push('/')
                        }
                    }
                }
            })
        },
        createTask() {
            this.$refs['taskForm'].validate(valid => {
                if (valid) {
                    addTemporaryTask(this.taskForm).then(res => {
                        console.log(res.data)
                        this.$notify.success({
                            title: '成功',
                            message: "添加临时任务成功"
                        })
                        this.cancelAction()
                    }).catch(res => {

                        this.$notify.error({
                            title: '失败',
                            message: res.msg
                        })
                    })
                } else {

                    console.log("表单验证不通过")
                }
            })
        },
        getInEnterpriseDominantList(){
            getInEnterpriseDominantList({deleted:false}).then(res=>{
                this.enterpriseDominantList = res.data
            }).catch(error=>{

            })
        },
        getInUserList(val) {
            getInUserList({flagId:val,deleted: false}).then(res => {
                this.userList = res.data
            }).catch(error => {

            })
        },
        getInRegionList(){
            getInRegionList({}).then(res=>{
                this.regionList = res.data
            }).catch(error=>{
                console.log(error)
            })
        },


    }

}
</script>
